<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 100px;
            height: 100px;
            background-color: green;
        }
    </style>
</head>
<body>
    <!-- 点击创建就创建， 点击删除删除div -->
    <button onclick="addEl()">创建</button>
    <button onclick="delEl()">删除</button>

    <script>
        var scriptEl = document.getElementsByTagName('script')[0];
        var bodyEl = document.body;

        function addEl() {
            // 创建并插入script标签之前
            var createEl = document.createElement('div');
            bodyEl.insertBefore(createEl, scriptEl);
            // bodyEl.appendChild(createEl);

        }

        function delEl() {
            var delDivs = document.getElementsByTagName('div');
            // 判断div标签是否全部删除
            if ( delDivs.length === 0 ) {
                alert('没有了');
                return;
            }
            bodyEl.removeChild(delDivs[0]);
        }
    </script>
</body>
</html>